@user.main("登录") {

    <style>

        .nav-tabs{
            display: flex;
            list-style: none;
            border-bottom: 1px solid #e6e6e6;
            padding-left: 10px;
        }

        .nav-item{
            padding: 7px 15px;
            margin-bottom: -1px;
            border-top-left-radius: 5px;
            border-top-right-radius: 5px;
            color: #2D8B67;
        }

        .nav-item:hover{
            background-color: #e6e6e6;
            cursor: pointer;
        }

        .active{
            border: 1px solid #e6e6e6;
            border-bottom: 1px solid white;
        }


    </style>

    <div class="box-right" style="height: 400px">

        <p class="page-title">复旦带出样本在线申请系统</p>
        <p class="page-title" style="font-size: 25px">登录</p>


        <form id="msgForm" >
            <div class="row form-group">
                <input type="text" placeholder="手机号" class="form-input" name="phone"  style="font-family: password"/>
                <i class="fa fa-user fa-icon"></i>
            </div>

            <div class="row form-group">
                <input type="text" placeholder="手机验证码" class="form-input" name="code" style="width: 70%"/>
                <i class="fa fa-shield  fa-icon"></i>
                <input type="button" class="form-input code" id="code" value="获取验证码" onclick="createCode('#msgForm')"  />
                <small class="help-block" id="code-error"></small>

            </div>

            <div class="row" style="margin-top: 55px">
                <button type="button" class="btn btn-narrow" onclick="MsgLogin()">立即登录</button>
            </div>


        </form>

    </div>


    <script>

            $(function () {
                loginFormValidation()
            })

            function MsgLogin() {
                $("#code-error").empty();
                let form = $("#msgForm");
                form.formValidation("revalidateField", "code");
                let fv = form.data("formValidation");
                fv.validate();
                if (fv.isValid()) {
                    $.ajax({
                        url: "@routes.UserController.msgLogin()",
                        type: "post",
                        data: form.serialize(),
                        success: function (data) {
                            if (data === 500) {
                                swal("错误", "用户名或密码错误", "error")
                            } else if(data === 501){
                                swal("错误", "账号还未通过审核，请稍后再试", "error")
                            } else if(data === 502){
                                swal("错误", "验证码错误，请重新输入", "error")
                            }else{
                                window.location.href = "@routes.HomeController.index()"
                            }
                        }
                    })
                }
            }


    </script>

}
